<!DOCTYPE html>
<html lang="zh" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('流程模型列表')"/>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="formId">
                <div class="select-list">
                    <ul>
                        <li>
                            <p>KEY：</p>
                            <input name="key" type="text"/>
                        </li>
                        <li>
                            <p>名称：</p>
                            <input name="name" type="text"/>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i
                                    class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
                                    class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="btn-group-sm" id="toolbar" role="group">
            <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="process:todoitem:export">
                <i class="fa fa-plus"></i> 创建新模型
            </a>
        </div>
        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table" style="word-break:break-all; word-wrap:break-all;"></table>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var removeFlag = [[${@permission.hasPermi('process:todoitem:remove')}]];
    var prefix = ctx + "modeler";

    $(function () {
        var options = {
            url: prefix + "/list",
            // url: ctx + "repository/models",
            // contentType:"application/json;charset=UTF-8",
            // contentType :"",
            createUrl: prefix + "/addModal",
            updateUrl: prefix + "/edit/{id}",
            removeUrl: prefix + "/remove",
            exportUrl: prefix + "/export",
            modalName: "流程模型",
            columns: [{
                checkbox: true
            },
                {
                    field: 'id',
                    title: 'ID'
                },
                {
                    field: 'key',
                    title: 'KEY'
                },
                {
                    field: 'name',
                    title: '名称'
                },
                {
                    field: 'version',
                    title: '版本'
                },
                {
                    field: 'createTime',
                    title: '创建时间'
                },
                {
                    field: 'lastUpdateTime',
                    title: '最后更新时间'
                },
                {
                    field: 'metaInfo',
                    title: '元数据'
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs" href="javascript:void(0)" onclick="successCallback(\'' + row.id + '\')"><i class="fa fa-edit"></i> 编辑</a> ');
                        actions.push('<a class="btn btn-primary btn-xs" href="javascript:void(0)" onclick="deployModel(\'' + row.id + '\')"><i class="fa fa-cloud-upload"></i> 部署</a> ');
                        actions.push('<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="export2Bpmn(\'' + row.id + '\')"><i class="fa fa-download"></i> 导出</a> ');
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-remove"></i> 删除</a> ');
                        return actions.join('');
                    }
                }]
        };

        $.table.init(options);
        // options.method = 'GET';
        // options.start = options.pageNumber;
        // options.size = options.pageSize;
        // $('#bootstrap-table').bootstrapTable('refreshOptions', options);

        // console.log(options['pageNumber'])
        // console.log(options['pageSize'])
        // var options = $('#bootstrap-table').bootstrapTable('getOptions');
        // $('#bootstrap-table').bootstrapTable('refreshOptions', {
        //     method: 'GET',
        //     start: options['pageNumber'] * 1 - 1,
        //     size: options['pageSize']
        // });
    });

    function showVerifyDialog(taskId, module, pageName, nodeName, todoUserId) {
        if (todoUserId !== currentUser.loginName) {
            $.modal.alertWarning("不允许非待办人办理待办事项！");
            return;
        }
        var url = prefix + "/showVerifyDialog/" + taskId + "?module=" + module + "&formPageName=" + pageName;
        $.modal.open(nodeName, url);
    }

    function export2Bpmn(modelId) {
        window.location.href = prefix + "/export/" + modelId;
    }

    function successCallback(modelId) {
        createMyMenuItem(ctx + "modeler/modeler.html?modelId=" + modelId, "模型在线设计");
    }

    function createMyMenuItem(dataUrl, menuName) {
        var panelUrl = window.frameElement.getAttribute('data-id');
        dataIndex = $.common.random(1, 100), flag = true;
        if (dataUrl == undefined || $.trim(dataUrl).length == 0) return false;
        var topWindow = $(window.parent.document);
        // 选项卡菜单不存在
        if (flag) {
            var str = '<a href="javascript:;" class="active menuTab" data-id="' + dataUrl + '" data-panel="' + panelUrl + '">' + menuName + ' <i class="fa fa-times-circle"></i></a>';
            $('.menuTab', topWindow).removeClass('active');

            // 添加选项卡对应的iframe
            var str1 = '<iframe class="RuoYi_iframe" name="iframe' + dataIndex + '" width="100%" height="100%" src="' + dataUrl + '" frameborder="0" data-id="' + dataUrl + '" data-panel="' + panelUrl + '" seamless></iframe>';
            $('.mainContent', topWindow).find('iframe.RuoYi_iframe').hide().parents('.mainContent').append(str1);

            // 添加选项卡
            $('.menuTabs .page-tabs-content', topWindow).append(str);
        }
        return false;
    }

    function deployModel(modelId) {
        $.modal.confirm("确认要部署至流程定义吗?", function () {
            $.post(prefix + "/deploy/" + modelId, "", function (result) {
                $.modal.msgSuccess(result.msg);
            });
        });


    }
</script>
</body>
</html>
